<template>
  <div class="search content-box">
    <h6 class="title-h6">产品查询</h6>
    <div class="searh">
      <el-form :inline="true" :model="productForm" class="form-container" label-width="110px">
        <div class="postInfo-container">
          <el-row>
            <el-col :span="8">
              <el-form-item label="产品名称/编码" >
                <el-input v-model="productForm.name" placeholder="输入产品名称/编码" size="medium" style="min-width:217px;"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="投放渠道">
                <el-select v-model="productForm.channel" placeholder="投放渠道" size="medium">
                  <el-option label="本地包" value="1"></el-option>
                  <el-option label="收藏夹" value="2"></el-option>
                  <el-option label="外放" value="3"></el-option>
                  <el-option label="收藏夹" value="4"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="产品状态 ">
                <el-select v-model="productForm.state" placeholder="产品状态" size="medium">
                  <el-option label="启用" value="1"></el-option>
                  <el-option label="下线" value="0"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="8">
              <el-form-item  label="合同状态 ">
                <el-select v-model="productForm.contact" placeholder="合同状态" size="medium">
                  <el-option label="签署中" value="0"></el-option>
                  <el-option label="已完成" value="1"></el-option>
                  <el-option label="其他" value="2"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="物料状态 ">
                <el-select v-model="productForm.materiel" placeholder="物料状态" size="medium">
                  <el-option label="已设置" value="1"></el-option>
                  <el-option label="未设置" value="0"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-form-item>
            <el-button type="primary" @click="onSubmit">查询</el-button>
            <el-button type="success" class="search-add"><router-link :to="{path:'add'}">添加产品</router-link></el-button>
          </el-form-item>
        </div>
  
</el-form>
    </div>
    
  </div>
</template>

<script>
export default {
  name: 'ProductSearch',
  data() {
      return {
        productForm: {
          name: '',
          channel: '',
          state: '',
          contact: '',
          materiel: ''
        }
      }
    },
    methods: {
      onSubmit() {
        console.log('submit!');
      }
    }
}
</script>

<style lang="scss">
    .title-h6 {
      line-height: 30px;
      padding-left: 20px;
      text-align: left;
      font-size: 14px;
      border-bottom: 1px solid #eee;
    }
    .content-box {
      width: 100%;
        background-color: #fff;
        border: 1px solid #ddd;
        border-radius: 5px;
        margin-top: 10px;
    }
    .searh {
      .el-form-item__label {
        color: #000;
      }
      .search-add {
        a {
          color: #fff;
          
        }
        
      }
    }
</style>
 <style lang="scss" scoped>
 .postInfo-container {
   position: relative;
   padding: 20px 15px 0;
   .postInfo-container-item {
     float: left;
   }
 }
  
</style>

